<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head> 
<link href="../css/bootstrap.css" rel="stylesheet">
<title>Insert title here</title>
</head>
<script src="../js/jquery-2.1.4.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<!-- 默认配置文件 -->
    <script type="text/javascript" charset="utf-8" src="../uedit/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="../uedit/ueditor.all.min.js"> </script>
    <!-- 语言文件 -->
    <script type="text/javascript" charset="utf-8" src="../uedit/lang/zh-cn/zh-cn.js"></script>
    <!-- 如果需要页面渲染的话引入 -->
    <script type="text/javascript" charset="utf-8" src="../uedit/ueditor.parse.min.js"></script>
<script type="text/javascript">
var ue = UE.getEditor('ueditor');
$(function(){
	function getMsg(){
		$.ajax({
			url:"../msg/getMsg",
			success:function(json){
				var data = JSON.parse(json);
				var msg = "";
				for(var i = data.length-1;i>=0;i--){
					 msg = msg+data[i].msg+"  "+"  "+data[i].datetime+"<br>"	
				}
				$("#screen").html(msg);
			}
		});
	}
	
	setInterval(getMsg, 1000);
});
function submitMsg(){
	var msg = $("#msg").val();
	var msg = {"msg":msg};
	$.ajax({
		type:"post",
		url:"../msg/insertMsg",
		data:msg,
		success:function(data){
			var d = JSON.parse(data);
			$("#msg").val("");
		}
	});
}

</script>
<body>
<div class="container">
<div class="row">
  <div class="col-md-4 col-md-offset-5"><h1>WELCOME！</h1></div>
   <div class="col-md-2 col-md-offset-1" style="padding-top: 20px">
   <button class="btn btn-default"  type="button">登入</button>
    <button class="btn btn-default"  type="button">注册</button>
   </div>
</div>
<div class="row">
<div class="col-md-12">
<div id="screen"></div>
<div>
<input type="text" id="msg"><button class="btn btn-default" onclick="submitMsg()">Enter</button>
</div>
<!-- <div id="myCarousel" class="carousel slide"> -->
<!--    <!-- 轮播（Carousel）指标 --> -->
<!--    <ol class="carousel-indicators"> -->
<!--       <li data-target="#myCarousel" data-slide-to="0" class="active"></li> -->
<!--       <li data-target="#myCarousel" data-slide-to="1"></li> -->
<!--       <li data-target="#myCarousel" data-slide-to="2"></li> -->
<!--    </ol>    -->
<!--    <!-- 轮播（Carousel）项目 --> -->
<!--    <div class="carousel-inner"> -->
<!--       <div class="item active"> -->
<!--          <img src="../img/t1.jpg" width="100%" alt="First slide"> -->
<!--       </div> -->
<!--       <div class="item"> -->
<!--          <img src="../img/t2.jpg" width="100%" alt="Second slide"> -->
<!--       </div> -->
<!--       <div class="item"> -->
<!--          <img src="../img/t3.jpg" width="100%" alt="Third slide"> -->
<!--       </div> -->
<!--    </div> -->
<!--    <!-- 轮播（Carousel）导航 --> -->
<!--    <a class="carousel-control left" href="#myCarousel"  -->
<!--       data-slide="prev">&lsaquo;</a> -->
<!--    <a class="carousel-control right" href="#myCarousel"  -->
<!--       data-slide="next">&rsaquo;</a> -->
<!-- </div>  -->
</div>
</div>
<div class="row">
<script id="ueditor" type="text/plain">初始化是显示的内容</script>
</div>
<div class="row">

</div>
</div>
</body>
</html>